
<!-- 修改角色弹框 -->
<template>
    <div>
      <el-dialog
        title="修改角色"
        :visible.sync="dialogVisible"
        width="30%"
        :before-close="handleClose"
        style="margin-top: 15vw"
      >
        <span>
          <el-form ref="form" :model="form" label-width="80px">
            <el-form-item label="选择角色">
              <el-select
                multiple 
                v-model="value"
                placeholder="请选择"
                @change="selectChange"
              >
                <el-option
                  v-for="(item, index) in options"
                  :key="index"
                  :label="item.label"
                  :value="item.id"
                >
                </el-option>
              </el-select>
            </el-form-item>
          </el-form>
        </span>
        <span slot="footer" class="dialog-footer">
          <el-button @click="dialogVisible = false">取 消</el-button>
          <el-button type="primary" @click="onSubmit">确 定</el-button>
        </span>
      </el-dialog>
    </div>
  </template>
    
    <script>
  import {
    updateUserSetRole,
    getSwRoles,
    getUserRole
  } from "@/api/datacentersg/achives/documentApi";
  export default {
    data() {
      return {
        dialogVisible: false,
        form: {
          user: "",
        },
        value:[],
        row: [],
        options: [],
        valueName:[],
      };
    },
    methods: {
      initUserPop(row) {
        console.log(row, "row");
        this.row = row;
        this.dialogVisible = true;
        getSwRoles().then((result) => {
          if (result.code === 0) {
            this.options = result.data.res_data.map((obj) => ({
              label: obj.roleName,
              value: obj.roleId,
              id: obj.roleId,
            }));
            // console.log(this.options,"options");
            // this.value = this.row[0].roleId; // 设置初始值
            // // this.value = result.data.res_data.map(res => res.id)
            // // this.value = this;
            // // this.valueName.map((item)=>{
            // //   this.value.push({
            // //     item,
            // //   })
            // // })
            if(this.row.length == 1){
              getUserRole({userId:this.row[0].userId}).then((res)=>{
                this.value = []
                res.data.res_data.map((res)=>{
                  this.value.push(res.roleId)
                })
              })
            }
            
          }
        });
      },
      selectChange(value) {
        console.log(value, "value");
        this.valueName = value;
  
      },
      handleClose(done) {
        done();
      },
      onSubmit() {
        let params = [];
        if(!Array.isArray(this.row)) {
          return false;
        }
        // params = 
        this.row.map((e) => {
          this.valueName.map((item)=>{
            params.push({
              userId: e.userId,
              roleId:item,
            })
            // return {
             // 获取选定角色的roleId
          // };
          })
        });
        // console.log(params,"params");
        // return false
        updateUserSetRole(params).then((result) => {
          if (result.code == 0) {
            this.$message({
              message: "操作成功",
              type: "success",
            });
            this.$emit("initData");
            this.dialogVisible = false;
          }
        });
      },
    },
  };
  </script>
    
    <style>
  </style>